﻿<%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>作业提交详情 - 教务管理系统</title>
    <link href="${pageContext.request.contextPath}/resources/bootstrap5/css/bootstrap.min.css" rel="stylesheet">
    <!-- Bootstrap Icons - 本地版本 -->
    <link href="${pageContext.request.contextPath}/resources/bootstrap-icons/1.11.3/bootstrap-icons.css" rel="stylesheet">
    <!-- Bootstrap Icons - 备用CDN -->
    <link href="https://cdn.bootcdn.net/ajax/libs/bootstrap-icons/1.11.3/font/bootstrap-icons.min.css" rel="stylesheet">
    <!-- 第二个备用CDN -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.css">
    <style>
        .sidebar {
            background: linear-gradient(135deg, #2196f3 0%, #1976d2 100%);
            min-height: 100vh;
            color: white;
            width: 220px;
            position: fixed;
            top: 0;
            left: 0;
            z-index: 1000;
        }

        .main-content {
            margin-left: 220px;
            padding: 20px;
        }

        .header {
            background: white;
            border-bottom: 1px solid #e0e0e0;
            padding: 15px 30px;
            margin: -20px -20px 20px -20px;
            box-shadow: 0 2px 4px rgba(0,0,0,0.1);
        }

        .card {
            border: none;
            box-shadow: 0 2px 12px rgba(0,0,0,0.1);
            border-radius: 8px;
        }

        .card-header {
            background: #f8f9fa;
            border-bottom: 1px solid #e0e0e0;
            font-weight: bold;
        }

        .btn-primary {
            background: #2196f3;
            border-color: #2196f3;
        }

        .btn-primary:hover {
            background: #1976d2;
            border-color: #1976d2;
        }

        .file-link {
            display: inline-block;
            padding: 8px 16px;
            background: #e3f2fd;
            border: 1px solid #2196f3;
            border-radius: 4px;
            color: #1976d2;
            text-decoration: none;
            margin-top: 10px;
        }

        .file-link:hover {
            background: #2196f3;
            color: white;
            text-decoration: none;
        }
    </style>
</head>
<body>
<!-- 侧边栏 -->
<div class="sidebar">
    <div class="p-3">
        <h5><i class="bi bi-mortarboard"></i> 教学管理</h5>
    </div>
    <nav class="nav flex-column">
        <a class="nav-link text-white" href="${pageContext.request.contextPath}/teacher/home">
            <i class="bi bi-house"></i> 首页
        </a>
        <a class="nav-link text-white" href="${pageContext.request.contextPath}/teacher/homework">
            <i class="bi bi-journal-text"></i> 作业管理
        </a>
    </nav>
</div>

<!-- 主内容区 -->
<div class="main-content">
    <!-- 页面头部 -->
    <div class="header">
        <div class="d-flex justify-content-between align-items-center">
            <div>
                <h4 class="mb-0">作业提交详情</h4>
                <small class="text-muted">查看学生提交的作业详情</small>
            </div>
            <div>
                <a href="${pageContext.request.contextPath}/teacher/homework/submissions/${submission.homework.id}"
                   class="btn btn-outline-secondary">
                    <i class="bi bi-arrow-left"></i> 返回提交列表
                </a>
            </div>
        </div>
    </div>

    <!-- 作业详情 -->
    <div class="card mb-4">
        <div class="card-header">
            <i class="bi bi-journal-text"></i> 作业详情
        </div>
        <div class="card-body">
            <div class="row">
                <div class="col-md-6">
                    <strong>作业标题：</strong>
                    ${submission.homework.title}
                </div>
                <div class="col-md-6">
                    <strong>课程名称：</strong>
                    ${submission.homework.course.name}
                </div>
            </div>
            <div class="row mt-2">
                <div class="col-md-12">
                    <strong>作业内容：</strong>
                    <p class="mt-1">${submission.homework.content}</p>
                </div>
            </div>
        </div>
    </div>

    <!-- 学生详情 -->
    <div class="card mb-4">
        <div class="card-header">
            <i class="bi bi-person"></i> 学生详情
        </div>
        <div class="card-body">
            <div class="row">
                <div class="col-md-4">
                    <strong>学号：</strong>
                    ${submission.student.user.username}
                </div>
                <div class="col-md-4">
                    <strong>姓名：</strong>
                    ${submission.student.user.realName}
                </div>
                <div class="col-md-4">
                    <strong>提交时间：</strong>
                    <c:choose>
                        <c:when test="${not empty submission.createTimeStr}">
                            ${submission.createTimeStr}
                        </c:when>
                        <c:otherwise>
                            <span class="text-muted">暂无</span>
                        </c:otherwise>
                    </c:choose>
                </div>
            </div>
        </div>
    </div>

    <!-- 提交内容 -->
    <div class="card mb-4">
        <div class="card-header">
            <i class="bi bi-file-text"></i> 提交内容
        </div>
        <div class="card-body">
            <c:choose>
                <c:when test="${not empty submission.content}">
                    <div class="border p-3 rounded" style="background-color: #f8f9fa;">
                            ${submission.content}
                    </div>
                </c:when>
                <c:otherwise>
                    <p class="text-muted">学生未提交任何内容</p>
                </c:otherwise>
            </c:choose>

            <c:if test="${not empty submission.fileUrl}">
                <div class="mt-3">
                    <strong>上传文件：</strong>
                    <a href="${pageContext.request.contextPath}${submission.fileUrl}"
                       class="file-link" target="_blank">
                        <i class="bi bi-download"></i> 下载文件
                    </a>
                </div>
            </c:if>
        </div>
    </div>

    <!-- 打分 -->
    <div class="card">
        <div class="card-header">
            <i class="bi bi-star"></i> 打分
        </div>
        <div class="card-body">
            <div class="row">
                <div class="col-md-4">
                    <strong>当前成绩：</strong>
                    <c:choose>
                        <c:when test="${not empty submission.score}">
                            <span class="badge bg-success fs-6">${submission.score} 分</span>
                        </c:when>
                        <c:otherwise>
                            <span class="text-muted">暂无</span>
                        </c:otherwise>
                    </c:choose>
                </div>
                <div class="col-md-8">
                    <button type="button" class="btn btn-warning"
                            onclick="scoreSubmission(${submission.id}, '${submission.student.user.realName}')">
                        <i class="bi bi-star"></i> 打分 / 修改成绩
                    </button>
                </div>
            </div>
        </div>
    </div>
</div>

<script src="${pageContext.request.contextPath}/resources/bootstrap5/js/bootstrap.bundle.min.js"></script>
<script>
    // 打分功能
    function scoreSubmission(submissionId, studentName) {
        const score = prompt('请输入' + studentName + ' 的成绩（0-100分）');
        if (score !== null && score !== '') {
            const scoreNum = parseFloat(score);
            if (isNaN(scoreNum) || scoreNum < 0 || scoreNum > 100) {
                alert('请输入0-100之间的数字');
                return;
            }

            // 发起打分请求
            fetch('${pageContext.request.contextPath}/teacher/homework/submission/score', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/x-www-form-urlencoded',
                },
                body: 'submissionId=' + submissionId + '&score=' + scoreNum
            })
                .then(response => response.json())
                .then(data => {
                    if (data.success) {
                        alert('打分成功');
                        location.reload();
                    } else {
                        alert('打分失败：' + (data.message || '未知错误'));
                    }
                })
                .catch(error => {
                    console.error('Error:', error);
                    alert('打分失败，请稍后重试');
                });
        }
    }
</script>
</body>
</html>

